<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更换验证码</title>
</head>
<body>

<script>
    //   分析:
    //     点击超链接或者图片,需要换一张
    // 1.给超链接和图片绑定单机事件
    //
    // 2.重新设置图片的src属性值

    window.onload=function (){
        //1.获取图片对象
        var img=document.getElementById("checkCode");
        //2.绑定单击事件
        img.onclick=function (){
            //加时间戳
            var date=new Date().getTime();

            img.src="/Servlet3_0/checkCodeServlet?"+date;
        }
    }

</script>

    <img id="checkCode" src="/Servlet3_0/checkCodeServlet">

    <a id="change" href="">看不清 ? 换一张</a>
<!--当用户点击<a>标签时，浏览器的默认行为是尝试进行页面跳转，但由于href为空，页面跳转不会发生。
同时，因为<a>标签和<img>标签在页面上可能重叠或相邻，用户的点击可能同时触发了<img>标签的点击事件，导致了验证码的刷新。-->
</body>
</html>